import { Component, OnInit, ViewChild, TemplateRef } from '@angular/core'
import { STColumn, STComponent } from '@delon/abc'
import { SFSchema } from '@delon/form'
import { ListBaseClass } from '@shared/classes/ListBaseClass'
import { RiskControlRule, RiskRuleModeMap } from '@shared/interfaces/risk-control'
import { IQueryParams } from '@shared/interfaces/queryParams'
import { I18nSelectPipe } from '@angular/common'
import { Route, ActivatedRoute, Router } from '@angular/router'
import { RiskService } from '../../risk.service'
import { NzMessageService, NzI18nService } from 'ng-zorro-antd'
import { I18NService } from '@core'
import { DataService } from '@shared/services/data.service'
import { ModalService } from '@shared/services/modal.service'

@Component({
  selector: 'app-risk-detail-tab-rules',
  templateUrl: './tab-rules.component.html',
  styleUrls: ['../../../../shared/styles/table.less'],
})
export class RiskDetailTabRulesComponent extends ListBaseClass<RiskControlRule, IQueryParams> implements OnInit {

  @ViewChild('tplControl') tplControl: TemplateRef<void>

  RiskRuleModeMap = RiskRuleModeMap

  columns: STColumn[] = [
    {
      type: 'link',
      title: '规则名称',
      i18n: 'RISK_CTRL.RULE.NAME',
      index: 'name',
      width: '150px',
      className: 'text-center',
      fixed: 'left',
      click: this.goRuleDetail.bind(this)
    },
    {
      title: '规则模式',
      i18n: 'RISK_CTRL.RULE.MODE',
      index: 'mode',
      width: '100px',
      className: 'text-center',
      render: 'mode',
    },
    {
      title: '创建时间',
      i18n: 'GENERAL.INFO.CREATED_AT',
      index: 'createdAt',
      width: '200px',
      type: 'date',
      dateFormat: 'YYYY-MM-DD HH:mm',
      className: 'text-center',
    },
    {
      title: '更新时间',
      i18n: 'GENERAL.INFO.UPDATED_AT',
      index: 'updatedAt',
      width: '200px',
      type: 'date',
      dateFormat: 'YYYY-MM-DD HH:mm',
      className: 'text-center',
    },
    {
      title: '操作',
      i18n: 'GENERAL.INFO.OPERATION',
      width: '150px',
      className: 'text-center p-xs',
      fixed: 'right',
      buttons: [
        {
          text: '',
          click: this.deleteRuleDialog.bind(this),
          icon: {
            iconfont: 'icon-delete-twotone',
            type: 'iconfont',
          },
        },
      ]
    }
  ]

  constructor(
    public msg: NzMessageService,
    public i18n: I18NService,
    public route: ActivatedRoute,
    public router: Router,
    private riskService: RiskService,
    private dataService: DataService,
    private modalService: ModalService,
  ) {
    super(msg, i18n, route, router)
  }

  ngOnInit() {
    const { rules } = this.dataService.riskControlScheme
    this.data = rules
    this.total = rules.length
    this.stPage = {
      show: false,
      front: false,
      total: false,
      showQuickJumper: false,
    }
  }

  goRuleDetail(rule: RiskControlRule): void {
    const { id, type } = rule
    this.router.navigate([`./${type}/${id}`], { relativeTo: this.route })
  }

  goAddRule(): void {
    this.router.navigate([`./new`], { relativeTo: this.route })
  }

  deleteRuleDialog(record: RiskControlRule): void {
    const { name } = record
    this.modalService.delete(this.trans('GENERAL.NOTIFICATION.DELETE_CONFIRM')).subscribe(
      (isOk) => {
        if (!isOk) return
        this.deleteRule(record)
      }
    )
  }

  deleteRule(record: RiskControlRule): void {
    const { type, id } = record
    this.riskService.deleteRule(type, id).subscribe(
      (result) => {
        this.msg.success(this.trans('GENERAL.NOTIFICATION.DELETE_SUCCESS'))
        this.removeRecord(id)
      },
      (err) => {
        const { error }  = err
        this.msg.error(this.trans('GENERAL.NOTIFICATION.DELETE_FAIL'))
      }
    )
  }

  private removeRecord(id: number): void {
    this.data.forEach((data, i: number) => {
      if (data.id === id) {
        this.data.splice(i, 1)
      }
    })
    this.st.reload()
  }
}
